<template>
    <div class="manage_body">
        <div>
            <el-table
                :data="MyForums" stripe
                style="width:100%">
                <el-table-column prop="create_time" label="创作日期" width="180"></el-table-column>
                <el-table-column prop="title" label="文章标题" width="350"></el-table-column>
                <el-table-column prop="type" label="文章类型" width="180"></el-table-column>
                <el-table-column prop="published" label="是否发布" width="150"></el-table-column>
                <el-table-column prop="source" label="是否原创" width="150"></el-table-column>
                <el-table-column
                    prop="id"
                    fixed="right"
                    label="论坛管理"
                    style="width: 15%">
                    <template slot-scope="scope">
                        <el-button @click="View(scope.row.id)" size="small">查看</el-button>
                        <el-button type="success" @click="Update(scope.row.id)" size="small">编辑</el-button>
                        <el-button @click="Delete(scope.row.id)" type="primary" size="small">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <div>
            <el-pagination
                @current-change="handleCurrentChange($event,index)"
                background
                layout="prev, pager, next"
                :current-page="currentPage"
                :page-size="pageSize"
                :total="total">
            </el-pagination>
        </div>
    </div>
</template>

<script>
export default {
  data () {
    return {
      MyForums: [],
      total: 0,
      currentPage: 1,
      pageSize: 15
    }
  },
  methods: {
    getMyForums () {
      var token = sessionStorage.getItem('token')
      this.$axios.defaults.headers.Authorization = 'Bearer ' + token
      this.$axios.get('/other_forum/myforum', {
        params: {
          current: 1,
          size: 10,
          uid: window.sessionStorage.getItem('uid')
        }
      }).then(response => {
        this.$set(this, 'MyForums', response.data.data.records)
        this.convertMyForums(this.MyForums)
        this.total = response.data.data.total
        this.pageSize = response.data.data.size
        this.currentPage = response.data.data.current
      })
    },
    handleCurrentChange (val, index) {
      var token = sessionStorage.getItem('token')
      this.$axios.defaults.headers.Authorization = 'Bearer ' + token
      this.$axios.get('/other_forum/myforum', {
        params: {
          current: val,
          size: 10,
          uid: window.sessionStorage.getItem('uid')
        }
      }).then(response => {
        this.$set(this, 'MyForums', response.data.data.records)
        this.convertMyForums(this.MyForums)
        this.total = response.data.data.total
        this.pageSize = response.data.data.size
        this.currentPage = response.data.data.current
      })
    },
    convertMyForums (MyForums) {
      var i = 0
      for (; i < MyForums.length; i++) {
        if (MyForums[i].published) MyForums[i].published = '已发布'
        else MyForums[i].published = '未发布'
        console.log(MyForums[i].published)
        if (MyForums[i].source === 1) MyForums[i].source = '原创'
        else MyForums[i].source = '转载'
      }
    },
    View (id) {
      this.$router.push({ name: 'forumdetails', params: { id: id } })
    },
    Update (id) {
      this.$router.push({ name: 'updateForum', params: { id: id } })
    },
    Delete (id) {
      var token = sessionStorage.getItem('token')
      this.$axios.defaults.headers.Authorization = 'Bearer ' + token
      this.$axios.get('/other_forum/deleteForum', {
        params: {
          id: id
        }
      }).then(response => {
        if (response.data.code === '200') this.$message.success('删除成功!')
        else this.$message.error('删除失败!')
        this.getMyForums()
      })
    }
  },
  mounted () {
    this.getMyForums()
  }
}
</script>

<style>
.el-table__header tr,
        .el-table__header th {
            padding: 0;
            height: 30px;
            line-height: 30px;
        }
        .el-table__body tr,
        .el-table__body td {
            padding: 0;
            height: 30px;
            line-height: 30px;
        }
</style>
